class Page{
    constructor(ops){
    
        this.url = ops.url;
        this.pageCont = ops.pageCont;
        this.num = ops.num;
        this.cont = ops.cont;
       
        this.load();
    }
    // 请求数据，调用ajax
    load(){
        $.ajax({
            url:this.url,
            success:res=>{
              
                this.res = JSON.parse(res).msg;
                // console.log(this.res)
                this.createPage()
               
            }
        })
    }
    createPage(){
       
        this.pageCont.pagination(this.res.length, {
            // 一页显示几条数据
            items_per_page:this.num,
            prev_text:"上一页",
			next_text:"下一页",
            callback:(index)=>{            
                this.index = index;
                this.render();
            }
        })
    }
    render(){
    
        let str = "";
        for(var i=this.index*this.num;i<this.index*this.num+this.num;i++){
            if(i < this.res.length){
                str += `<div class="list-b" index="${this.res[i].proId}">
                <a href="./commodity.html?id=${this.res[i].proId}">
                 <img src="${this.res[i].imgs}" alt="" class="click">
                 <p class="list-img" >${this.res[i].proName}</p>
               <em>￥</em> <span>${this.res[i].price}</span>
               </a>
               <p class="shop"><a href="##" class="shopa">加入购物车</a></p>
            </div>`;
            }
        }
        this.cont.html(str);
    }
}

new Page({
    url:"http://localhost:3000/database/commodity.json",
    pageCont:$(".pagination"),
    num:5,
    cont:$("#list").children(".list-a")
})



